<template>
    <div class="tou">
        <el-space wrap>
            <el-card v-for="item in item.data" class="qu"  >
                <div class="box-content">
                        123 
                </div>
                <template #header>
                    <div>
                        <img :src="item.imgUrl" class="kuan1"/>
                    </div>
                </template>
               
            </el-card>
        </el-space>
    </div>
</template>


<script setup>
import { reactive } from 'vue'
import { postMultipleGetGuessYouLike } from '../../utils/api'
const item = reactive({ data: [] });
async function search() {
    let { data } = await postMultipleGetGuessYouLike();
    item.data.length = 0;
    item.data.push(...data.data)
}
search();
</script>
<style scoped>
.tou {
    width: 580px;
    margin: 0 auto;
    margin-top: 40px;
}
.kuan1{
    width: 185px;
    height: 263px;
}
.qu{
        margin-left: -20px;
        width: 205px;
        box-shadow: 0 0px 0px;
        border: 0px;
        height: 275px;
}
.box-content{
    width: 183px;
    height: 263.5px;
    text-align: center;
    background-color: rgba(255, 60, 27, 0.64);
    color: #fff;
    font-size: 14px;
    z-index: 999;
}
</style>